<template>
  <el-row class="caseInfo">
    <!-- <el-col>
      <TopManu @handleCase="handleCase" />
    </el-col> -->
    <el-col class="ul">
      <el-col :span="24" class="list fromList">
        <el-col class="fromList-li">
          <el-form :inline="true" :model="formInline" class="demo-form-inline">
            <el-form-item label="">
              <el-input v-model="formInline.name" placeholder="请输入患者名称"></el-input>
            </el-form-item>
            <el-form-item label="">
              <el-input v-model="formInline.doket" placeholder="经治医生名称"></el-input>
            </el-form-item>
            <el-form-item label="">
              <el-input v-model="formInline.tube" placeholder="床管医生名称"></el-input>
            </el-form-item>
            <el-form-item>
              <el-button type="primary" @click="onSubmit" >查询</el-button>
            </el-form-item>
            <el-form-item>
              <el-button type="primary" @click="reset" >重置</el-button>
            </el-form-item>
          </el-form>
        </el-col>
        <el-col class="fromList-li">
         <el-form :inline="true" :model="formList" class="demo-form-inline">
            <el-form-item label="">
              <el-select v-model="formList.type" placeholder="请选择病区">
                <el-option
                  v-for="item in typeOptions"
                  :key="item.id"
                  :label="item.name"
                  :value="item.id">
                </el-option>
              </el-select>
            </el-form-item>    
            <el-form-item label="">
              <choiceCascader :value='formList.office' @cascaderChange="cascaderChange" />
            </el-form-item>
            <el-form-item label="">
              <el-select v-model="formList.info" placeholder="在院状态">
                <el-option
                  v-for="item in infoOptions"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value">
                </el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="">
              <el-date-picker
                v-model="formList.date"
                type="daterange"
                range-separator="至"
                start-placeholder="开始日期"
                end-placeholder="结束日期">
              </el-date-picker>
            </el-form-item>
          </el-form>
        </el-col>
      </el-col>
      <el-col :span="24" class="list from">
        <FromList  @handleEdit="handleEdit" :tableTitle="tableTitle" :tableData="tableData2" style='border-radius: 10px;' />
      </el-col>
      <el-col :span="24" class="list pagination">
        <el-pagination
        background
        :current-page="page"
        :page-size="limit"
        layout="total , prev, pager, next , jumper"
        @current-change="handlePagination"
        :total="userCount">
        </el-pagination>
      </el-col>
    </el-col>
    <el-dialog
      title="病历信息"
      :visible.sync="dialogVisible"
      width="100%"
      top="0"
      :before-close="handleClose">
      <span>
        <el-col :span="24">
          <el-form :inline="true" :model="dialogForm" class="demo-form-inline">
            <el-form-item label="">
              <el-input v-model="dialogForm.user" placeholder="请输入名称"></el-input>
            </el-form-item>
          
            <el-form-item>
              <el-button type="primary" @click="hendleDialog(1)">查询</el-button>
            </el-form-item>
         
          </el-form>
        </el-col>
        <el-col :span="24">
          <FromList @handelChange="handleTypeCheckBox"  @handleEdit="handleEditOne" :tableTitle="dialogTitle" :tableData="tableData" style='border-radius: 10px;' />
        </el-col>
        <el-dialog
          width="100%"
          top="0"
          title="病例"
          :visible.sync="innerVisible"
          :before-close="()=>{innerVisible = false}"
          append-to-body>
          <span>
            <iframeDemo :url="overUrl" ref="iframeDemo" height="200px" />
          </span>
          <!-- <span slot="footer" class="dialog-footer">
            <el-button @click="innerVisible = false">取 消</el-button>
          </span> -->
        </el-dialog>
      </span>
      <span slot="footer" class="dialog-footer">
        <el-button @click="dialogVisible = false">取 消</el-button>
        <!-- <el-button type="primary" @click="dialogVisible = false">提交病历</el-button> -->
      </span>
    </el-dialog>
  </el-row>
</template>

<script>
import FromList from "@/forComponents/fromList/fromList"
import TopManu from "@/components/TopMenu";
import choiceCascader from "@/components/choiceCascader"
import iframeDemo from "@/components/iframeDemo/index.vue";
import {newDateX} from "@/utils/newDate"
import {
  getHospitalMember,
  dict_dataDictIndex,
  getAllIcu,
 
} from "@/api/hospitalNurse"
import {
 getMemberMedicalList,
 exportHospitalInfo
} from "@/api/zhuyanre"
let that 
export default {
  name:"caseInfo",
  data(){
    return {
      overUrl:"",
      formInline:{
        name:"",
        doket:"",
        tube:""
      },
      page:1,
      limit:5,
      userCount:0,
      formList:{
        type:"",
        office:"",
        info:"",
        date:"",
        newDate:""
      },
      innerVisible:false,
      typeOptions:[],
      officeOptions:[],
      infoOptions:[
        // {
        //   label:"待入院",
        //   value:1
        // },
        {
          label:"在院",
          value:2
        },
        {
          label:"申请出院",
          value:3
        },
        {
          label:"待出院",
          value:4
        },
        {
          label:"已出院",
          value:5
        }
      ],

      tableTitle:[
     
        {
          prop:"ipt_no",
          name:"住院号",
          type:1,
          width:100
        },
        {
          prop:"room_name",
          name:"床号",
          type:1,
          width:200
        },
        {
          prop:"memberName",
          name:"姓名",
          type:1,
        }, 
        {
          prop:"gunderType",
          name:"性别",
          type:1,
        },
        {
          prop:"deptName",
          name:"当前科室",
          type:1,
        },
        {
          prop:"walletIncome",
          name:"总费用",
          type:1,
        },
        // {
        //   prop:"walletMoney",
        //   name:"可用押金",
        //   type:1,
        // },
        {
          prop:"doctorName",
          name:"主治医生",
          type:1,
          width:200
        },
     
        // {
        //   prop:"nurseName",
        //   name:"护理等级",
        //   type:1,
        // },
        {
          prop:"begntime",
          name:"入院时间",
          type:1,
          width:200
        },
        // {
        //   prop:"deptName",
        //   name:"住院天数",
        //   type:1,
        // },
        { 
          prop:"statusLabel",
          name:"住院状态",
          type:1,
        },
        {
          prop:"diseaseName",
          name:"诊断",
          type:1,
          width:300
        },

        {
          prop:"memberNature",
          name:"病人性质",
          type:1,
        },
        {
          prop:"",
          name:"操作",
          type:4,
          width:200,
          arr:[
            {
              type:"success",
              number:1,
              name:"查看病历"
            },
               {
              type:"primary",
              number:2,
              name:"下载病案"
            },
          ],
     
          fixed:"right"
        },
      ],
      tableData:[],
      tableData2:[],
      indexDate:[],
      dataNature:[],
      floorData:[],
      dialogVisible:false,
      dialogFull:false,
      top:0,
      dialogForm:{
        name:"",  //名称
        info:"",  //状态
        role:"",  //角色
      },
      infoOptions2:[
        {
          label:"草稿",
          value:1
        },
        {
          label:"提交",
          value:2
        },
        {
          label:"归档",
          value:3
        },
      ],
      roleOptions:[
        {
          label:"通用",
          value:1
        },
        {
          label:"医生",
          value:2
        },
        {
          label:"护士",
          value:3
        },
      ],
      dialogTitle:[
        {
          prop:"key",
          name:"序号",
          type:1,
          width:50
        },
        {
          prop:"tpl_name",
          name:"病历",
          type:1,
        
        },
        {
          prop:"create_by_name",
          name:"首次添加人",
          type:1,
       
        },
        {
          prop:"created_at",
          name:"首次添加时间",
          type:1,
          width:200
        },
        {
          prop:"update_by_name",
          name:"更新人",
          type:1,
     
        },
        {
          prop:"save_time",
          name:"更新时间",
          type:1,
       
        },
     
        {
          prop:"is_complatename",
          name:"状态",
          type:1,
        
        },
      
        {
          prop:"",
          name:"操作",
          type:4,
          arr:[
            {
              type:"success",
              number:1,
              name:"查看"
            },
            // {
            //   type:"danger",
            //   number:2,
            //   name:"修改"
            // },
          ],
          width:150,
          fixed:"right"
        },
      ]
    }
  },  
  mounted(){
    that = this
    this.dict_dataDictIndex()
    this.getAllIcu()
  },
  methods:{
    handleCase(e){
      if(e == 1){
        this.$router.push("/admin/caseList")
      }
    },
    handleEditOne(e){
      console.log(e)
      if(e.key == 1){
        this.innerVisible = true
        this.overUrl = `http://localhost:8080/#/over?id=${e.data.tpl_id}`
        setTimeout(function () {
          that.$nextTick(function () {
            let json = {
              id:e.data.tpl_id,
            };
            that.$refs.iframeDemo.handleEmit(json);
          });
        }, 200);
      }
    },
    handleEdit(e){
      console.log(e)
      if(e.key == 1){
        this.dialogVisible = true
        getMemberMedicalList({hospital_id:e.data.id}).then(res=>{
           this.tableData=res.data
           for (let i = 0; i < this.tableData.length; i++) {
             this.tableData[i].is_complatename=this.tableData[i].is_complate==1?'完成':'待完成'
             
           }
console.log(res,'0000')
        })
      }else  if (e.key==2) {

              exportHospitalInfo({id:e.data.id}).then(res=>{
           if(res.code==200){
               window.open(this.$http + "/" + res.file_url);
            //  const a = document.createElement('a'); // 创建a标签
            // a.setAttribute('download', '');// download属性
            // a.setAttribute('href', this.$http+'/'+res.data.path);// href链接
            // a.click()

             }
      })
      }
    },
    handleClose(){
      this.dialogVisible = false
    },
    handleTypeCheckBox(e){
      console.log(e,"进入")
    },
    reset(){
      Object.keys(this.formList).forEach(key=>{
        this.$set(this.formList,key,"")
      })
      this.page = 1
      this.tableData = []
      this.getHospitalMember()
    },
    hendleDialog(e){
      console.log(e)
      switch(e){
        case 1:

        break
        case 2:
        break
        case 3:
        break
      }
    },
    onSubmit(){
      if(this.formList.date.length != 0){
        this.formList.newDate = newDateX(this.formList.date[0]) + '|' + newDateX(this.formList.date[1])
      }
      this.page = 1
      this.tableData2 = []
      this.getHospitalMember()
    },
    cascaderChange(e){
      this.formList.office = e
    },
    getAllIcu(){
      getAllIcu()
      .then(res=>{
        this.typeOptions = res.data
      })
      .catch(e=>{
        this.$message({
          message:e.message,
          type: 'error'
        });
      })
    },
    handlePagination(e){
      this.page = e
      this.tableData2 = []
      this.getHospitalMember()
    },
    // 获取数据字典
    dict_dataDictIndex(){
      dict_dataDictIndex({group_id:"4,7"})
      .then(res=>{
        this.dataNature = res.data[0].items
        this.indexDate = res.data[1].items
        
        this.getHospitalMember()
      })
      .catch(e=>{
        this.$message({
          message:e.message,
          type: 'error'
        });
      })
    },
    // 获取住院病人
    getHospitalMember(){
      let data = {
        page:this.page,
        limit:this.limit,
        m_keyword:this.formInline.name, //关键字
        status:this.formList.info,  //入院状态
        dept_id:this.formList.office,  //科室ID
        doctor_name:this.formInline.doket, //医生名称
        other_doctor_name:this.formInline.tube, // 床管医生
        times:this.formList.newDate, //入院时间
        source:4,
      }
      getHospitalMember({...data})
      .then(res=>{
        console.error(res.data) 
        res.data.list.forEach(item=>{
          // console.log(item)
          item.roomName = item.room_info[3]
          item.memberName = item.member.name
          item.gunderType = item.member.gender == 1 ? '男' : item.member.gender == 2 ? '女' : ''
           item.deptName = item.department_name
          item.walletMoney = item.wallet.wallet_money
          item.walletIncome = item.wallet.wallet_income
          item.doctorName = item.doctor.real_name
          item.doctorId = item.doctor.id
          item.diseaseName = ''
          if(item.disease){
            item.disease.forEach(list=>{
              item.diseaseName += list.disease_name
            })
          }
          this.dataNature.forEach(list=>{
            if(item.member.nature == list.id){
              item.memberNature = list.name
            }
          })
          item.statusLabel = item.status == 0 ? '' : item.status == 1 ? '待入院' : item.status == 2 ? '在院' : item.status == 3 ? '申请出院' : item.status == 4 ? '待出院' : item.status == 5 ? '已出院' : ''
          this.indexDate.forEach(list=>{
            if(item.nurse_level == list.id){
              item.nurseName = list.name
            }
          })
        })
        
        this.userCount = res.data.count
        this.tableData2 = res.data.list   
      })
      .catch(e=>{
        this.$message({
          message:e.message,
          type: 'error'
        });
      })
    }, 
  },
  components:{
    TopManu,
    FromList,
    choiceCascader,
    iframeDemo
  }
}
</script>

<style lang="scss" scoped>
  @import "./index.scss";
</style>